<template>
  <view style="background-color: #fff; padding-top: 1upx" class="bd t1">
    <view class="title">
      <text class="txt">计划名称</text>
    </view>
    <view class="art">{{ detail.planName }}</view>
    <view class="title">
      <text class="txt">计划目的</text>
    </view>
    <view class="art" v-html="detail.planGoal"></view>
    <!-- <view class="title">
			<text class="txt">计划状态</text>
		</view>
		<view class="art"  v-html="detail.planState"></view> -->
    <view class="title">
      <text class="txt">体检报告</text>
    </view>
    <!-- <image :src="detail.record.reportFileUrl" mode="aspectFit" style=""></image> -->
    <view class="imgbox" style="width: 100%" v-if="detail.record.reportFileUrl">
      <view
        v-for="(item, index) in (detail.record.reportFileUrl || '').split(',')"
      >
        <uploadimg :item="item"></uploadimg>
      </view>
    </view>
    <view class="art" style="width: 100%" v-else> 暂未上传报告 </view>
    <!-- 			<view class="title">
				<text class="txt">医生报告</text>
			</view>
			<view class="imgbox" style="width: 100%;" v-if="detail.record.doctorImgUrl">
			   <view v-for="(item,index) in (detail.record.doctorImgUrl || '').split(',')">
			    <uploadimg :item='item'></uploadimg>
			   </view>
			  </view>
			  <view class="art" style="width: 100%;" v-else>
			   暂未上传报告
			  </view> -->
    <view class="title">
      <text class="txt">体检备注</text>
    </view>
    <span class="art">{{ detail.record.remarks }}</span>
    <view class="title">
      <text class="txt">医生建议</text>
    </view>
    <span class="art" v-html="detail.record.doctorRecord"></span>
    <view class="title">
      <text class="txt">备注</text>
    </view>
    <view class="art" v-html="detail.planRemark"></view>
  </view>
</template>

<script>
import uploadimg from "@/components/uploadimg/uploadimg";
export default {
  components: { uploadimg },
  data() {
    return {
      id: "",
      detail: {},
      remark: "",
    };
  },
  watch: {
    popup(newv) {
      if (!newv) {
        this.getPlanDetail();
      }
    },
  },
  onLoad(options) {
    this.id = options.id;
    this.getPlanDetail();
  },
  onReady() {
    // this.getUiStyle();
  },
  methods: {
    getUiStyle() {
      var style = plus.navigator.getUiStyle();
      if ("dark" == style) {
        console.log("当前为暗黑模式");
        uni.setTabBarStyle({
          backgroundColor: "#1B1C1E",
        });
        uni.setNavigationBarColor({
          frontColor: "#ffffff",
          backgroundColor: "#1B1C1E",
          animation: {
            duration: 400,
            timingFunc: "easeIn",
          },
        });
      } else {
        console.log("当前为普通模式");
      }
    },
    getPlanDetail() {
      let self = this;
      uni.showLoading({ title: "加载中", mask: true });
      setTimeout((s) => {
        uni.hideLoading();
      }, 5000);
      this.config
        .post("/oldInfo/getTjOldInfo", { planId: this.id })
        .then((res) => {
          uni.hideLoading();
          //console.log(res)
          if (res.data.code === 200) {
            self.detail = res.data.data;
          } else {
            if (res.data.code == "-201") {
              self.config.handleError(res.data);
            } else {
              uni.showToast({
                title: self.config.handleError(res.data),
                icon: "none",
              });
            }
          }
        });
    },
  },
};
</script>

<style lang="less" scoped>
.imgbox {
  width: 100%;
  display: flex;
  flex-direction: row;
  overflow-x: scroll !important;
}
.inp-group {
  padding: 0 20upx;
  margin: 30upx 0;
  .inp-title {
    width: 200upx;
  }
}

.title {
  padding: 20upx 50upx;
  background-color: #eee;
  .txt {
    padding: 0 20upx;
    border-left: 8upx solid #18c7e1;
  }
}
.art {
  padding: 30upx 50upx;
  line-height: 46upx;
  // text-indent: 50upx;
}
</style>
<style scoped>
@media (prefers-color-scheme: closedark) {
  .bd {
    background-color: #1b1c1e !important;
    height: calc(100vh - var(--window-top));
  }
  .title {
    background-color: #38383c !important;
  }
  .t1 {
    color: #ccc !important;
  }
  .art {
    background-color: #1b1c1e !important;
  }
  >>> span {
    color: #ccc !important;
  }
  >>> section {
    color: #ccc !important;
    background-color: #1b1c1e !important;
  }
  .readcount {
    background-color: #1b1c1e !important;
  }
}
</style>
